{{define "resource/add.html"}}
<!DOCTYPE html>
<html>
	<head>
        {{template "header"}}
	</head>

	<body>
		<div class="weadmin-nav">
            <span class="layui-breadcrumb">
                <a href="/welcome">首页</a>
                <a href="/admin/resource/list">资源管理</a>
                <a><cite>添加资源</cite></a>
            </span>
		</div>
		<div class="weadmin-body">
			<form class="layui-form">
				<div class="layui-form-item">
					<div class="layui-inline">
						<label for="L_title" class="layui-form-label">
							<span class="we-red">*</span>资源名称
						</label>
						<div class="layui-input-inline">
							<input type="text" id="L_title" name="title" lay-verify="title" autocomplete="off" class="layui-input" placeholder="资源名称">
						</div>
					</div>

					<div class="layui-inline">
						<label for="L_resourceicon" class="layui-form-label">
							<span class="we-red">*</span>资源图标
						</label>
						<div class="layui-input-inline">
							<input type="text" id="L_resourceicon" name="resourceicon" lay-filter="resourceicon" class="layui-input">
						</div>
					</div>
				</div>

				<div class="layui-form-item">
					<div class="layui-inline">
						<label for="L_resourceurl" class="layui-form-label">
							<span class="we-red">*</span>资源URL
						</label>
						<div class="layui-input-inline">
							<input type="text" id="L_resourceurl" name="resourceurl" lay-verify="resourceurl" value="#" autocomplete="off" class="layui-input" placeholder="资源URL">
						</div>
					</div>

					<div class="layui-inline">
						<label for="L_sortnum" class="layui-form-label">
							<span class="we-red">*</span>排序号
						</label>
						<div class="layui-input-inline">
							<input type="text" id="L_sortnum" name="sortnum" lay-verify="required|number|sortnum" value="1" autocomplete="off" class="layui-input" placeholder="排序号">
						</div>
					</div>
				</div>

				<div class="layui-form-item">
					<label for="L_parentid" class="layui-form-label">
						<span class="we-red">*</span>父级资源
					</label>
					<div class="layui-input-inline">
						<select name="parentid" lay-filter="parentid" id="L_parentid">
							<option value="0">顶级资源</option>
							{{ range .parentResList }}
							<option value="{{.Value}}">{{.Text}}</option>
							{{ end }}
						</select>
					</div>
				</div>

				<div class="layui-form-item">
					<label for="L_category" class="layui-form-label">资源类别
					</label>
					<div class="layui-input-block">
						<input type="radio" class="default" name="category" value="1" title="菜单" checked>
						<input type="radio" class="nodefault" name="category" value="2" title="分组" >
						<input type="radio" class="nodefault" name="category" value="3" title="功能按钮" >
					</div>
				</div>

				<div class="layui-form-item">
					<label for="L_remark" class="layui-form-label">备注
					</label>
					<div class="layui-input-block">
						<input type="text" id="L_remark" name="remark" lay-verify="remark" autocomplete="off" class="layui-input" placeholder="备注描述">
					</div>
				</div>

				<div class="layui-form-item">
					<button class="layui-btn fr" lay-filter="add" lay-submit="">确定</button>
				</div>
			</form>
		</div>
    </body>

    {{template "jsfile"}}
	<script type="text/javascript">
		layui.config({
		  base: '/static/js/',
		  admin: '/static/js/admin',
		}).use('iconPicker');
		layui.use(['jquery', 'form','element', 'admin', 'carousel','iconPicker'], function() {
			var element = layui.element,
				$ = layui.jquery,
				carousel = layui.carousel,
				form = layui.form,
				iconPicker = layui.iconPicker,
				admin = layui.admin;
			//建造实例
			carousel.render({
				elem: '.weadmin-shortcut'
				,width: '100%' //设置容器宽度
				,arrow: 'none' //始终显示箭头
				,trigger: 'hover'
				,autoplay:false
			});

			form.verify({
				title: function(value){
					if(value.length <= 0){
						return '资源名称不允许为空!';
					}
					if(value.length > 200){
						return '资源名称允许最大200字符!';
					}
				},
				resourceurl: function(value){
					if(value.length <= 0){
						return '资源URL不允许为空!';
					}
					if(value.length > 200){
						return '资源URL允许最大200字符!';
					}
				},
				sortnum: function(value){
					if(value.length <= 0){
						return '排序号不允许为空!';
					}
					if(value <= 0){
						return '排序号须为正整数!';
					}
				},
				remark: function(value){
					if(value.length > 200){
						return '备注允许最大200字符!';
					}
				},
			})

			//监听提交
			form.on('submit(add)', function(data){
				$.post("/admin/resource/add",data.field,function(result){
					if(result.status){
						layer.msg("添加资源成功!",{time:3*1000,icon:1},function(){
							//自动关闭layer
							var index = parent.layer.getFrameIndex(window.name);
							parent.layer.close(index);
							//刷新list
							parent.resourceRefreshForm();
						})
					}else{
						layer.msg(result.message,{time:6*1000,icon:2})
					}
				},"json");
				return false;
			});

			iconPicker.render({
                // 选择器，推荐使用input
                elem: '#L_resourceicon',
                // 数据类型：fontClass/unicode，推荐使用fontClass
                type: 'fontClass',
                // 是否开启搜索：true/false
                search: true,
                // 是否开启分页
                page: true,
                // 每页显示数量，默认12
                limit: 12
            });

			//父级资源 改变限制资源类型选择
			function parentSelectChange(currvalue){
				if(currvalue == 0){
					$('input:radio[name=category]')[0].checked = true;
					$('input:radio[name=category]')[1].checked = false;
					$('input:radio[name=category]')[2].checked = false;
					form.render('radio');
					$("input:radio[name='category'].nodefault").attr('disabled','true');
					$("input:radio[name='category'].nodefault").next().addClass("layui-radio-disbaled layui-disabled");
				}else{
					$("input:radio[name='category'].nodefault").removeAttr('disabled');
					$("input:radio[name='category'].nodefault").next().removeClass("layui-radio-disbaled layui-disabled");
				}
			}
			//父级菜单监听，当父级菜单为顶级菜单时不允许为category设置为分类和功能按钮
			form.on('select(parentid)', function(data){
				parentSelectChange(data.value);
			});

			parentSelectChange(0);
		});
	</script>

</html>
{{end}}